<template>
  <div>
    <h1 class="home">home</h1>
    <p>{{ title }}</p>
    <button @click="goto">gotoAbout</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      title: "this is a home page",
    };
  },
  methods: {
    // 通过注入路由器，我们可以在任何组件内通过 this.$router 访问路由器，也可以通过 this.$route 访问当前路由：
    goto() {
      this.$router.push({
        path: "/about",
        name: "about",
        params: {
          username: "1212121",
        },
        query: {
          h: "张三",
        },
      });
    },
  },
};
</script>

<style scoped>
.home {
  color: black;
}
</style>
